<template>
  <div class="panel-tab__content">
    <el-form v-model="bpmn.bpmnData" size="mini" label-width="80px">
      <el-form-item label="合并属性" required>
        <el-input v-model="bpmn.bpmnData.activityMerge" @change="updateBaseInfo('activityMerge')" placeholder="业务分组合并字段" />
      </el-form-item>
      <el-form-item label="执行人">
        <el-input v-model="bpmn.bpmnData.assignLabel" @focus="selectType = 'assignLabel'"></el-input>
      </el-form-item>
      <el-form-item label="展示条件" required>
        <el-select v-model="bpmn.bpmnData.activityCondition" style="width: 100%"  @change="updateBaseInfo('activityCondition')">
          <el-option v-for="item in conditions" :key="item.value" :value="item.value" :label="item.label" />
        </el-select>
      </el-form-item>
      <el-form-item label="处理视图" required>
        <el-popover
            placement="bottom"
            title="视图模型选择"
            width="600"
            trigger="click"
            v-model="selectVisible">
          <view-table select @rowSelect="selectView"></view-table>
          <el-input slot="reference" v-model="bpmn.bpmnData.activityView"  placeholder="默认处理视图" @change="updateBaseInfo('activityView')"></el-input>
        </el-popover>
<!--        <el-input type="textarea" :rows="4" v-model="bpmn.bpmnData.activityView" placeholder="业务处理地址"
                  @change="updateBaseInfo('activityView')"></el-input>-->
      </el-form-item>
      <el-form-item label="任务描述" required>
        <el-input type="textarea" :rows="8" v-model="bpmn.bpmnData.activityDescribe" placeholder="${xx}动态属性,动态属性来源于业务模型"
                  @change="updateBaseInfo('activityDescribe')"></el-input>
      </el-form-item>
<!--      <el-form-item label="视图标签">
        <el-input v-model="bpmn.bpmnData.viewLabel" @change="updateBaseInfo('viewLabel')" placeholder="用于加载可选视图" />
      </el-form-item>
      <el-form-item label="模板标签">
        <el-input v-model="bpmn.bpmnData.templateLabel" @change="updateBaseInfo('templateLabel')" placeholder="用于加载报告模板"  />
      </el-form-item>
      <el-form-item label="签名标签">
        <el-input v-model="bpmn.bpmnData.confLabel" @change="updateBaseInfo('confLabel')" placeholder="用于加载签名配置"  />
      </el-form-item>
      <el-form-item label="资源标签">
        <el-input v-model="bpmn.bpmnData.resourceType" @change="updateBaseInfo('resourceType')" placeholder="生成资源分类" />
      </el-form-item>-->
    </el-form>

    <el-dialog :title="'选择执行人'" :visible="visible" append-to-body width="80%" @close="visible = false">
      <div>
        <el-tabs v-model="activeName">
          <el-tab-pane label="选择用户" name="user" lazy>
            <user-branch @rowSelect="selectObj" />
          </el-tab-pane>
          <el-tab-pane label="选择岗位" name="job" lazy>
            <job-table select @rowSelect="selectObj" />
          </el-tab-pane>
          <el-tab-pane label="选择角色" name="role" lazy>
            <role-table select @rowSelect="selectObj" />
          </el-tab-pane>
          <el-tab-pane label="选择组织" name="group" lazy>
            <branch-table @rowSelect="selectObj" />
          </el-tab-pane>
        </el-tabs>
      </div>
    </el-dialog>
  </div>
</template>
/**
* @description
* @author mao
* @time: 2021/8/12 3:13 下午
**/
<script>
import UserBranch from "@/views/system/user/UserBranch";
import JobTable from "@/views/system/job/JobTable";
import RoleTable from "@/views/system/role/RoleTable";
import BranchTable from "@/views/system/group/BranchTable";
import ViewTable from "@/views/system/view/ViewTable";
export default {
  name: 'PanelActivity',
  components: {
    ViewTable, BranchTable, RoleTable, JobTable, UserBranch
  },
  inject: {
    bpmn: {
      from: 'bpmn'
    },
    setExtensions: {
      from: 'setExtensions'
    }
  },
  data() {
    return {
      visible: false,
      selectVisible: false,
      selectType: '',
      activeName: 'user',
      conditions: [
        { value: 'runing > 0', label: '存在进行中' },
        { value: 'total == runing && runing > 0', label: '全在进行中' },
      ]
    }
  },
  watch: {
    selectType() {
      if (!this.selectType) {
        this.visible = false
      } else {
        this.visible = true
      }
    }
  },
  methods: {
    updateBaseInfo(key) {
      const config = {  }
      config[key] = this.bpmn.bpmnData[key]
      this.setExtensions(config)
    },
    selectView(row) {
      const { callCmd } = row
      this.$set(this.bpmn.bpmnData, 'activityView', callCmd)
      this.updateBaseInfo('activityView')
      this.selectVisible = false
    },
    selectObj(row){
      this.$set(this.bpmn.bpmnData, 'assignType', this.activeName)
      if (this.activeName === 'user') {
        this.$set(this.bpmn.bpmnData, 'assignValue', row.userId)
        this.$set(this.bpmn.bpmnData, 'assignLabel', row.nickName)
      } else if (this.activeName === 'job') {
        this.$set(this.bpmn.bpmnData, 'assignValue', row.jobId)
        this.$set(this.bpmn.bpmnData, 'assignLabel', row.jobName)
      } else if (this.activeName === 'role') {
        this.$set(this.bpmn.bpmnData, 'assignValue', row.roleId)
        this.$set(this.bpmn.bpmnData, 'assignLabel', row.roleName)
      } else if (this.activeName === 'group') {
        this.$set(this.bpmn.bpmnData, 'assignValue', row.branchId)
        this.$set(this.bpmn.bpmnData, 'assignLabel', row.groupAllName)
      }
      this.setExtensions({
        assignValue: this.bpmn.bpmnData.assignValue,
        assignLabel: this.bpmn.bpmnData.assignLabel,
        assignType: this.bpmn.bpmnData.assignType
      })
      this.selectType = ''
    }
  }
}
</script>

<style scoped>

</style>
